<%-- 
    Document   : Matricula
    Created on : 17/09/2013, 03:56:11 PM
    Author     : davis
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Matricular</title>
        <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
        <script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
        <script src="http://jquery.bassistance.de/validate/additional-methods.js"></script>
        <link rel="stylesheet" type="text/css" href="css/cssPaginas.css"/>
        <script src="js/Matricula/jsMatricula.js"></script>
    </head>
    <body onload="inicioMatricula();">
    <center>
        <div id="iconos" style="width: 70%;border:1px solid black;height: 65px">
            <div id="cancelarIcon" class="icono" onclick="javascript:alert('cancelado...')">
                <a href="#">
                    <img src="images/Iconos/Cancelar.png" height="30px" width="30px" />
                </a><div>Cancelar</div>
            </div>
            <div id="eliminarIcon" class="icono" onclick="javascript:alert('eliminado...')">
                <a href="#">
                    <img src="images/Iconos/Borrar.png" height="30px" width="30px" />
                </a><div>Eliminar</div>
            </div>
            <div id="buscarIcon" class="icono" onclick="buscarMatriculas()">
                <a href="#">
                    <img src="images/Iconos/Buscar.png" height="30px" width="30px" />
                </a><div>Buscar</div>
            </div>
            <div id="modificarIcon" class="icono" onclick="javascript:alert('modificar...')">
                <a href="#">
                    <img src="images/Iconos/Editar.png" height="30px" width="30px" />
                </a><div>Modificar</div>
            </div>
            <div id="guardarIcon" class="icono" onclick="javascript:alert('en proceso...')">
                <a href="#">
                    <img src="images/Iconos/Guardar.png" height="30px" width="30px" />
                </a><div>Guardar</div>
            </div>
            <div id="nuevoIcon" class="icono" onclick="nuevaMatricula()">
                <a href="#">
                    <img src="images/Iconos/Nuevo.png" height="30px" width="30px" />
                </a><div>Nuevo</div>
            </div>
            
        </div>
        <div style="width: 70%; border: 1px solid black">
            <div id="inicioMatricula"  style="border: 1px solid blue;background-image:url(images/Aguila.jpg);height:300px;background-size: 100% 300px">        
                <br><br><br><br><br><br><br><br><br><br><br>
                <center>
                    <h3>Administrar Matricula</h3>
                </center>
            </div>
            <div id="nuevaMatricula"  style="border:1px solid blue">
                <form id="myform" method="POST" >
                        <table>
                            <tr>
                                <td></td>
                                <td></td>
                                <td>Datos Personales</td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td>Datos especificos</td>
                                <td></td>
                            </tr>
                            <tr>
                                <td align="right">Nombres:</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="nombres" /></td>
                                <td width="100">&nbsp</td>
                                <td align="right">Area a la que postula:</td>
                                <td>&nbsp</td>
                                <td width="180"><select  id="area"></select> Nuevo</td>
                                <td></td>
                            </tr>
                            <tr>
                                <td align="right">Apellido Paterno:</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="apPaterno" /></td>
                                <td width="100">&nbsp</td>
                                <td align="right">Salon:</td>
                                <td>&nbsp</td>
                                <td width="180"><input type="text" id="salon" readonly="readonly"/></td>
                                <td></td>
                            </tr>
                            <tr>
                                <td align="right">Apellido Materno:</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="apMaterno" /></td>
                                <td width="100">&nbsp</td>
                                <td align="right">Forma de pago:</td>
                                <td>&nbsp</td>
                                <td><select  id="formaPago">
                                        <option value="1">Todo en I</option>
                                        <option value="2">En  II partes</option>
                                        <option value="3">En III partes</option>
                                    </select>
                                </td>
                                <td><input type="text" id="pagos" size="10" readonly="readonly"/></td>
                            </tr>
                            <tr>
                                <td align="right">DNI:</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="dni" /></td>
                                <td width="100">&nbsp</td>
                                <td align="right"></td>
                                <td>&nbsp</td>
                                <td width="180"></td>
                            </tr>
                            <tr>
                                <td align="right">Telefono</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="telefono" /></td>
                                <td width="100">&nbsp</td>
                                <td align="right"></td>
                                <td>&nbsp</td>
                                <td width="200"></td>
                            </tr>
                            <tr>
                                <td align="right">E-mail</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="email" /></td>
                                <td width="100">&nbsp</td>
                                <td align="right"></td>
                                <td>&nbsp</td>
                                <td width="180"></td>
                            </tr>

                        </table>
                        <br/>
                        <br/>
                        <table>
                            <tr>
                                <td align="right">Fecha de Inicio:</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="fechaInicio" /></td>
                                <td width="50">&nbsp</td>
                                <td align="right">Fecha de Finalizacion:</td>
                                <td>&nbsp</td>
                                <td width="100"><input type="text" id="fechaFinalizacion" /></td>
                            </tr>
                        </table>
                    <input type="submit" value="Matricular" onclick="crearSalon()"/>
                </form>
            </div>
            <div id="buscarMatriculas" style="border: 1px solid blue;">
                <center>
                    <h3>Buscar Matriculas</h3>
                </center>
                <form id="myform" method="POST">
                    <table>
                        <tr>
                            <td align="right"><label for="field">Codigo matricula: </label></td>
                            <td align="left"><input type="text" class="left" id="codMatricula" name="codigo"></td>
                            <td>
                                <div class="icono" onclick="javascript:alert('buscando...')">                
                                    <img src="images/Iconos/Buscar.png" height="16px" width="16px" />                    
                                </div>
                            </td>
                        </tr>            
                    </table>        
                </form>
            </div>
        </div>
    </center>
    </body>
</html>
